import { CaretDownOutlined } from '@ant-design/icons';
import { useModel } from '@umijs/max';
import type { MenuProps } from 'antd';
import { Avatar, Dropdown, Space } from 'antd';
import MessagePopconfirm from './message-popconfirm';
import { history } from '@umijs/max';

const Index = () => {
  const {
    initialState: { userInfo },
  } = useModel('@@initialState');

  const items: MenuProps['items'] = [
    {
      key: '1',
      label: <a>重置密码</a>,
    },
    {
      key: '2',
      label: <a onClick={()=>{
        history.push('/login')
      }}>退出登录</a>,
    },
  ];
  return (
    <>
      <Space>
        <MessagePopconfirm />
        <Avatar src={userInfo?.avatar} className='mb-[2px]'/>
        <Dropdown menu={{ items }} arrow>
          <a onClick={(e) => e.preventDefault()}>
            <Space>
              <span className="max-w-[60px] overflow-hidden text-ellipsis line-clamp-1 cursor-pointer">
                {userInfo?.name}
              </span>
              {/* <img
                src={dowmIcon}
                className="w-[20px] h-[20px] cursor-pointer"
              /> */}
              <CaretDownOutlined />
            </Space>
          </a>
        </Dropdown>
      </Space>
    </>
  );
};
export default Index;
